{% extends 'base.html' %}
{% block css %}
<link rel="stylesheet" type="text/css" href="/static/css/recommendLine.css">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=bY0NZM5tFg4mpbGGj65x79OG"></script>
{% endblock %}
{% block content %}
<!-- scenic start -->
<div class="am-panel-group" id="point">
    {% for point in original_line.scenic %}
    <div class="am-panel">
      <div class="am-panel-hd" data-am-collapse="{parent: '#point', target: '#content{{ point.number }} '}" >
        第{{ point.number }}站:  <span>{{point.tag }}</span>
      </div>
      {% if point.number == 1 %} 
      <div class="am-panel-bd am-panel-collapse am-collapse am-in" id="content{{ point.number }}">
      {% else %}
      <div class="am-panel-bd am-panel-collapse am-collapse" id="content{{ point.number }}">
      {% endif %}
        <ul>
          <li>
            <div id="panel{{point.number}}" class="panel-comment">

            </div>
            <a class="more-way">更多</a>
          </li>
        </ul>
        <div  class="am-panel-hd second-hd">
          <span>{{ point.name }}</span>
          <a href="">进入 <i class="am-icon-angle-right" aria-hidden="true"></i> </a>
        </div>
        <ul>
          <li>
            门票：
            <span>{{ point.ticket }}</span>
          </li>
          <li>
            特色：
            <span>{{ point.abstract }}</span>
          </li>
          <li>
          时间安排：{{ point.time }} 
          </li>
        </ul>
      </div>
    </div>
    {% endfor %}
</div>
<!-- scenic end -->

<div id="lineMap" style="width: 100%;height: 500px;">

</div>

<!-- line map start-->
<div class="map-show">
    地图规划
<div>

<!-- line map end -->

<!-- loading start -->
<div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="my-modal-loading">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">正在为您规划路线...
       <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      <span class="am-icon-spinner am-icon-spin"></span>
    </div>
  </div>
</div>
<!-- loading end -->
{% endblock %}

{% block js %}
<script type="text/javascript" src="/static/js/recommend.js"></script>
{% endblock %}
